/**
 * Created by ritamashin on 2017/11/11.
 */
import React, {PureComponent} from 'react'
import {FlatList, StyleSheet,View,Text} from 'react-native'
import {COLOR} from '../../../config'
import HomepageGiftItem from './homepage-gift-item'
import BannerView from './BannerView'
import {bindActionCreators} from 'redux'
import {connect} from 'react-redux'
import HomepageSecondBanner from './homepage-second-banner'


 class HomepageTableView extends PureComponent{
    static defaultProps = {
        dataSource : [],
        tagId : '',
        index : '',
    }

    // 构造
      constructor(props) {
        super(props);
        // 初始状态
        this.state = {};
      }


      render(){
        let {dataSource, onPressItemAction, endReachAction} = this.props;
        return(
            <FlatList style={styles.flatListStyle}
                      data = {dataSource}
                      keyExtractor = {this.keyExtractorFlatList}
                      showsVerticalScrollIndicator={false}
                      renderItem = {(merchantItem) => (
                          <HomepageGiftItem giftItem={merchantItem['item']}
                                            onPressItemAction= {onPressItemAction()} />
                      )}
                      ItemSeparatorComponent = {this.renderSeparatorComponent}
                      onEndReachedThreshold={0.01}
                      onEndReached={() => endReachAction()}
                      ListHeaderComponent={() => this.renderTabHeader()}

            />
        )
      }
      // 对每个cell 增加一个key 值
      keyExtractorFlatList = (item : Object, index : number) => {
          return index
      };
      // 分割线
      renderSeparatorComponent= ()=>(
          <View style={styles.separatorStyle}/>
      )
    // 渲染头视图
    renderTabHeader = () => {
        let {index,bannerData ,onPressBannerAction, onPressSecondBannerAction} = this.props;
        if (Number.parseInt(index) === 0){
           //return <BannerView dataArray={bannerData}/>
            return <View>
                <BannerView dataArray = {bannerData} onPressBannerAction = {onPressBannerAction()}/>
                <HomepageSecondBanner onPressSecondBannerAction= {onPressSecondBannerAction()}/>
            </View>
        }else {
           return <View/>
        }
    }
}

const styles = StyleSheet.create({
   flatListStyle : {
       backgroundColor : 'white'
   },
   separatorStyle : {
       backgroundColor: COLOR.themeBackGroundRedColor,
       height : 10
   }
});

function mapStateToProps(state) {
    let {homepage} = state;
    let {bannerData} = homepage;
    return {
        ...this.props,
        bannerData
    }
}

function mapDispatchToProps(dispatch) {
    return bindActionCreators({},dispatch);
}

export default connect(mapStateToProps, mapDispatchToProps)(HomepageTableView)
